<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>表格展示页面</title>
		<!-- css样式-->
		<link rel="stylesheet" href="../layui/css/layui.css" />
		<!-- js文件-->
		<script src="../DomeData/tableJson.js"></script>
		<script language="javascript" type="text/javascript" src="../layui/layui.all.js"></script>

	</head>
	<body>
		<div>介绍：行编辑只开启了签名字段；监听行事件注释了，和列表单冲突,监听单元格事件开启城市字段</div>

		<hr class="layui-bg-red">
		<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
			<legend>弹出框的一些样式</legend>
		</fieldset>

		<div class="site-demo-button" id="layerDemo" style="margin-bottom: 0;">
			<button data-method="setTop" class="layui-btn">多窗口模式，层叠置顶</button>
			<button data-method="confirmTrans" class="layui-btn">配置一个透明的询问框</button>
			<button data-method="notice" class="layui-btn">示范一个公告层</button>
			<button data-method="offset" data-type="t" class="layui-btn layui-btn-normal">上弹出</button>
			<button data-method="offset" data-type="r" class="layui-btn layui-btn-normal">右弹出</button>
			<button data-method="offset" data-type="b" class="layui-btn layui-btn-normal">下弹出</button>
			<button data-method="offset" data-type="l" class="layui-btn layui-btn-normal">左弹出</button>
			<button data-method="offset" data-type="lt" class="layui-btn layui-btn-normal">左上弹出</button>
			<button data-method="offset" data-type="lb" class="layui-btn layui-btn-normal">左下弹出</button>
			<button data-method="offset" data-type="rt" class="layui-btn layui-btn-normal">右上弹出</button>
			<button data-method="offset" data-type="rb" class="layui-btn layui-btn-normal">右下弹出</button>
			<button data-method="offset" data-type="auto" class="layui-btn layui-btn-normal">居中弹出</button>
		</div>

		<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
			<legend>table的样式</legend>
		</fieldset>
		<div class="demoTable">
			搜索ID：
			<div class="layui-inline">
				<input class="layui-input" name="id" id="demoReload" autocomplete="off">
			</div>
			<button class="layui-btn" data-type="reload">搜索</button>
		</div>

		<table id="demo" lay-filter="test" ></table>

		<div id="Popup" style="display: none;">

			<div>这个是一个弹出层的使用页面元素来作为内容的示例</div>
		</div>
	</body>

	<!-- 工具栏模板： -->
	<script type="text/html" id="toolbarDemo">
		<div class="layui-btn-container">
			     <button class="layui-btn layui-btn-sm" lay-event="refresh">刷新</button>
		         <button class="layui-btn layui-btn-sm" lay-event="update">选中id值</button>
			     <button class="layui-btn layui-btn-sm" lay-event="popup">弹出窗口</button>
				  <button class="layui-btn layui-btn-sm" lay-event="del">删除</button>
		    </div>
		 </script>
	<!-- 表单元素模板： -->
	<script type="text/html" id="switchTpl">
		<!-- 这里的 checked 的状态只是演示 -->
  <input type="checkbox" name="sex" value="{{d.id}}" lay-skin="switch" lay-text="女|男" lay-filter="sexDemo" {{ d.id == 10003 ? 'checked' : '' }}>
</script>

	<script type="text/html" id="checkboxTpl">
		<!-- 这里的 checked 的状态只是演示 -->
  <input type="checkbox" name="lock" value="{{d.id}}" title="锁定" lay-filter="lockDemo" {{ d.id == 10006 ? 'checked' : '' }}>
</script>

	<script type="text/javascript" src="../js/TableView.js"></script>
</html>
